<script setup>
import Header from "@/components/Header/index.vue";
import Footer from "@/components/Footer/index.vue";
import { onMounted, onUpdated, ref } from "vue";
import { useRouter,useRoute } from "vue-router";
const router = useRouter();
const route=useRoute()
// onMounted(()=>{
//   console.log(1);
// })
</script>

<template>
  <div>
    <Header v-if="route.meta.isShow"/>
    <router-view></router-view>
    <Footer v-if="route.meta.isShow"/>
  </div>
</template>

<style  lang="scss">
html,
body {
  padding: 0;
  margin: 0;
  -webkit-font-smoothing: antialiased;
  font-size: 14vw/375 * 100;
  margin-bottom: 48vw/375 * 100;
}

a {
  color: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

::-webkit-scrollbar {
  display: none;
  height: 0;
  width: 0;
}

.line-camp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.line-camp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

/* 西瓜视频播放器 */
.xgplayer .xg-options-list li.selected,
.xgplayer .xg-options-list li:hover {
  color: #ffcd32 !important;
}

.xgplayer .xgplayer-progress-btn:before {
  border-radius: 2px !important;
}

/* 避免 UC 浏览器在网页内插入广告 */
iframe[src*="ucweb.com"] {
  display: none !important;
}

/* emoji */
.emoji {
  display: inline-block;
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  vertical-align: text-bottom;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* 路由加载进度条 */
#nprogress {
  pointer-events: none;
}

#nprogress .bar {
  position: fixed;
  z-index: 99999;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #ffcc32;
}

#nprogress .peg {
  display: block;
  position: absolute;
  right: 0px;
  width: 100px;
  height: 100%;
  box-shadow: 0 0 10px #ffcc32, 0 0 5px #ffcc32;
  opacity: 1;
  -webkit-transform: rotate(3deg) translate(0px, -4px);
  -ms-transform: rotate(3deg) translate(0px, -4px);
  transform: rotate(3deg) translate(0px, -4px);
}

.mui-image-loading {
  background: transparent !important;
}

.g-text-10 {
  display: inline-block;
  font-size: 12px;
  transform: scale(0.83);
}
</style>
